<template>
  <div id="study-app">
    <el-row>
      <el-col :span="12">
        <problemsVue />
      </el-col>
      <el-col :span="12">
        <div class="right">
          <div>
            <numberVue />
          </div>
          <div class="timer">
            <!-- <timerVue /> -->
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import problemsVue from "../../views/exam/problems.vue";
import timerVue from "../../views/exam/timer.vue";
import numberVue from "../../views/exam/number.vue";
export default {
  components: {
    problemsVue,
    numberVue,
    timerVue,
  },
};
</script>

<style scoped>
#study-app {
  width: 100%;
  height: calc(100vh - 70px);
}

.right {
  display: flex;
  flex-direction: column;
}

.timer {
  margin-top: 30px;
  margin-left: 300px;
}
</style>
